<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8"/>
        <title>000</title>
        <style>
            #div2 {
                margin:100px auto;
                font-size:0;
                text-align:center;
            }
        </style>
        <script>
            window.onload = function () {
                var oDiv1 = document.getElementById("div1");
                var oDiv2 = document.getElementById("div2");
                var aImg = oDiv2.getElementsByTagName("img");
                var arrImg = ["img/0.jpg","img/1.jpg","img/2.jpg","img/3.jpg","img/4.jpg","img/5.jpg","img/6.jpg","img/7.jpg","img/8.jpg","img/9.jpg","img/colon.jpg"];
                var timer = null;
                
                function time() {
                    var nowTime = new Date();
                    var nHour = nowTime.getHours();
                    var nMin = nowTime.getMinutes();
                    var nSec = nowTime.getSeconds();
                    var str = "";
                    
                    function change(n) {
                        if(n<10) {
                            return "0"+n;
                        }else {
                            return ""+n;
                        }
                        // return n<10 ? "0"+n : ""+n;
                    }
                  
                    str = change(nHour)+change(nMin)+change(nSec);
                    
                    aImg[0].src = arrImg[ str.charAt(0) ];
                    aImg[1].src = arrImg[ str.charAt(1) ];
                    aImg[3].src = arrImg[ str.charAt(2) ];
                    aImg[4].src = arrImg[ str.charAt(3) ];
                    aImg[6].src = arrImg[ str.charAt(4) ];
                    aImg[7].src = arrImg[ str.charAt(5) ];
                    
                }
                time();
                setInterval( time,1000 );
                
            }
        </script>
    </head>
    <body>
        <div id="div1"></div>
        <div id="div2">
            <img src="img/0.jpg"/>
            <img src="img/0.jpg"/>
            <img src="img/colon.jpg"/>
            <img src="img/0.jpg"/>
            <img src="img/0.jpg"/>
            <img src="img/colon.jpg"/>
            <img src="img/0.jpg"/>
            <img src="img/0.jpg"/>
        </div>
    </body>
</html>